<%@ page import="java.util.Calendar" %>
<%@ page import="java.util.Date" %>

<%@ include file="header.jsp"%>
<script type="text/javascript">
</script>
<body>	
	<div id="page-bank-container">
			
            <h1 class="banner-h1">Transaction</h1>
			
			<html:form action="paiement" focus="type_carte" method="POST" >
             
                <div id="form-transaction">
                      		
                	<fieldset class="text-center">
                    	<legend>Transaction</legend>
                			<c:forEach var="facture" items="${facture}">
				    	Montant : <span id="montant"><c:out value="${facture.montant}" /> $CAN</span><br />
                    	Num&eacute;ro de facture : <c:out value="${facture.idFacture}" /> <br />
                			</c:forEach>
            		</fieldset>
                    <br  />
                    
                	<fieldset>
                    	<legend>Moyen de Paiement</legend>
                        
                        <table width="450px" valign="middle">
                        	<tr style="text-align:center;">
                            	<td width="10%" valign="middle" align="center">
                            		<html:radio property="type_carte" value="visa"/>
                            	</td>
                                <td width="40%">
                                	<img alt="carte Visa" src="../images/visa.jpg" />
                                </td>
                                <td width="10%" valign="middle">
                                	<html:radio property="type_carte" value="mastercard"/>
                            	</td>
                                <td width="40%">
                                	<img alt="carte MasterCard" src="../images/mastercard.jpg" />
                                </td>
                            </tr>
                            <tr>
                            	<td colspan="2">Num&eacute;ro de la Carte Bancaire* : </td>
                                <td colspan="2">
                                	<html:text property="num_carte" value="" maxlength="16" size="16"/>
                                </td>
                            </tr>
			
                            <tr>
                            	<td colspan="2">Cryptogramme* : </td>
                                <td colspan="3">
                                	<html:text property="crypto" value="" maxlength="3" size="3" />
                                </td>
                            </tr>
                        	<tr>
                            	<td colspan="2">Date d'expiration* : </td>
                                <td colspan="2">
                                	<select name="mois" property="mois">
                                    	<%! int i = 0; %>
										<% for (i=1; i<13; i++) { %>
                                        	<option value="<%=i %>"><%=i %></option>
                                        <% } %>
                                	</select>
                                    /
                                	<select name="annee"  property="annee" >
										
										<% for (i=2009; i<2014; i++) { %>
										<option value="<%= i %>">
											<%= i %>
										</option>
                                        <%  } %>
                                	</select>
                                </td>
                            </tr>
                        </table>
                    </fieldset>
                    
                    <br  />
                
                	<fieldset>
                    	<legend>Information sur le <b>DETENTEUR de la carte</b></legend>
                        <table>
                        	<tr>
                            	<td>Nom* : </td>
                                <td><html:text property="nom" value="" /></td>
                           		<td>Pr&eacute;nom* :</td>
                                <td><html:text property="prenom" value="" /></td>
                            </tr>
                            <tr>
                            	<td>Adresse : </td>
                                <td colspan="3"><html:text property="adresse" value="" size="55" /></td>
                            </tr>
                            <tr>
                            	<td>Code Postal : </td>
                                <td><html:text property="cp" value="" /></td>
                            	<td>Ville : </td>
                                <td><html:text property="ville" value="" /></td>
                            </tr>
                            <tr>
                            	<td>Email* : </td>
                                <td colspan="3"><html:text property="email" value="" size="55" /></td>
                            </tr>
                        </table>
                    </fieldset>
            </div>            
                   
            <div class="btn-center">
            	<html:submit property="submit" value="" styleClass="btn-valider" />
                &nbsp;                 &nbsp;
                <html:button property="retour" value="" styleClass="btn-retour" onclick="history.back;" />
            </div>
    	</html:form>
    	
            
            	
	</div>
		
	<jsp:include page="footer.jsp" />

</body>


	<jsp:include page="balise_end_html.jsp" />



